<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link href="pagination/asset/normalize/normalize.css" type="text/css"
	rel="stylesheet" media="all">
<link href="pagination/css/layout.css" type="text/css" rel="stylesheet">
<link href="pagination/css/autoc.min.css" type="text/css"
	rel="stylesheet">
<link href="pagination/css/pagination.css" type="text/css"
	rel="stylesheet">
<script type="text/javascript" src="pagination/asset/jquery/jquery.js"></script>
<script type="text/javascript" src="pagination/js/autoc.js"></script>
<script type="text/javascript" src="pagination/js/pagination.js"></script>

<script type="text/javascript"
	src="http://www.5imvc.com/scripts/jbox/jBox/jquery-1.4.2.min.js"></script>
<!--jbox-->
<link id="skin" rel="stylesheet"
	href="http://www.5imvc.com/scripts/jbox/jBox/Skins/Default/jbox.css" />
<script type="text/javascript"
	src="http://www.5imvc.com/scripts/jbox/jBox/jquery.jBox-2.3.min.js"></script>
<script type="text/javascript"
	src="http://www.5imvc.com/scripts/jbox/jBox/i18n/jquery.jBox-zh-CN.js"></script>
<script type="text/javascript">

var webName="/projectajax1.0/UserServlet?type=";
$(function(){
	loadList(1,10);
	loadPagination();
})

function loadList(pageIndex,pageSize){
	$.getJSON(webName+"getUserPage",{"pageIndex":pageIndex,"pageSize":pageSize},function(data){
		var tab=$("#tab1")
		var msg="";
		tab.html("");
		for(var i=0;i<data.length;i++){
			msg+="<tr>";
			msg+="<td>"+data[i].id+"</td>";
			msg+="<td>"+data[i].name+"</td>";
			msg+="<td>"+data[i].pwd+"</td>";
			msg+="<td>"+data[i].rinfo.name+"</td>";
			msg+="<td><a href='javascript:deleteUser("+data[i].id+")'>删除</a>&nbsp;&nbsp;<a href='javascript:updateMSg("+data[i].id+")'>修改</a></td>";//","+data[i].info.id+
			msg+="</tr>";
		}
		tab.html(tab.html()+msg);
	});
}

 function updateMSg(id){
 	 $.getJSON(webName+"getUserById",{"id":id},function(data){
 		var name=data.name;
 		var pwd=data.pwd;
 		var rid=data.rinfo.id;
 		//createSelect()
 		//alert(createSelect(rid))
 		var html="<div id='update' >编号:<input type='text' name='id' id='id' readonly='readonly' value='"+id+"' ><br>用户名:<input type='text' name='name' id='name' value='"+name+"'><br>密码:<input type='text' name='pwd' id='pwd' value='"+pwd+"'><br>角色"+createSelect(rid)+"</div>"
		
		$.jBox(html, { title: "编辑用户信息",submit:function(){
			var name=$("#name").val()
			var pwd=$("#pwd").val()
			var rid=$("#select").val()
			$.post(webName+"updateUser",{"id":id,"name":name,"pwd":pwd,"rolesid":rid},function(data){
				if(data==1){
					alert("成功");
					loadList(1,10);
				}else{
					alert("失败")
				}
			})
		}});
 	}) 
 	
	 
} 
function createSelect(id){
	var msg
	var op1="<select id='select'><option value='1' "
	var op2=">BOSS<option value='2' "
	var op3=">CEO<option value='3' "
	var op4=">CFO<option value='4' "
	var op=">EMP</select>"
	var s="selected='selected'"
	
	switch(id){
		case 1:
			op1=op1+s;
			break;
		case 2:
			op2=op2+s;
			break;
		case 3:
			op3=op3+s;
			break;
		case 4:
			op4=op4+s;
			break;
		
		}
	msg=op1+op2+op3+op4+op
	/* $.getJSON(webName+"getRoles",{},function(data){
		alert("da")
		for(var i;i<data.length;i++){
		
			alert(data[i].id)
			alert(data[i].name)
		}
	}) */
	return msg;

}

function deleteUser(id){
	var submit = function (v, h, f) {
	    if (v){
	       $.get(webName+"deleteUser",{"id":id},function(data){
			if(data==1){
				//alert('aaa');
				//var index=args.currentPage
				loadList(1,10);
			}
				
			else
				alert('服务器异常,请联系管理员');
			})
	    	
	    }
	    else
	        jBox.tip("NO", 'info');
	    return true;
	};
	// 自定义按钮
	$.jBox.confirm("是否确定删除数据", "系统提示", submit, { buttons: { 'YES': true, 'NO': false} });
}

function loadPagination(){
	var Pager = new Pagination({
	    parent: '#div2',
	    totalPage: 30,
	    prevText:"上一页",
	    nextText:"下一页",
	    pageSize:5
	});

	Pager.on('afterChange', function(args){
		var index=args.currentPage
		loadList(index,10);
		
	});
}

</script>
</head>
<body>


	<div id="div1">
		<table border="1">
			<thead>
				<tr>
					<th>编号</th>
					<th>姓名</th>
					<th>密码</th>
					<th>角色</th>
					<th>操作</th>
				</tr>
			</thead>
			<tbody id="tab1">

			</tbody>
		</table>
	</div>
	<div id="div2"></div>
</body>
</html>






















